<template>
<div>
	<vhead></vhead>
	<vindex></vindex>
  <b-alert :show="true" state="success" dismissible>This is an alert </b-alert>
  <b-breadcrumb 
  :items=
  "[{text: 'Home', link: '#', active: true}, 
  {text: 'Manage', link: '#', active: true}, 
  {text: 'Library', active: false}]"/>
  <b-button :variant="primary" @click="clicked"> Click Me! </b-button>
	<vfoot></vfoot>
 </div> 
</template>

<script>
import vhead from '../../components/common/Head'
import vfoot from '../../components/common/Foot'
import vindex from '../../components/index/Index'
import Vue from 'vue'; 
import Alert from 'bootstrap-vue/components/alert.vue'  
import Breadcrumb from 'bootstrap-vue/components/Breadcrumb.vue'  
import Button from 'bootstrap-vue/components/Button.vue'  
// Register Alert component 
export default {
	components: {
      // 可以以key-value的形式注册组件, 此时挂载点的名字就是key
      // 否则挂载点和组件名字一致, 即vhead
      vhead,
      vfoot,
      vindex,
      bAlert:Alert,
      bBreadcrumb:Breadcrumb,
      bButton:Button,
  },
  methods:{
    clicked:function(){
      alert(111);
    }

  }  
    
}
</script>

<style>

</style>
